<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <title>贪吃蛇游戏</title>
  <style>
    body {
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100vh;
      background-color: #f0f0f0;
      margin: 0;
    }
    canvas {
      border: 1px solid black;
    }
    .controls {
      margin-top: 20px;
      display: flex;
      gap: 15px;
      justify-content: center;
      align-items: center;
    }
    .controls button {
      padding: 10px 20px;
      font-size: 16px;
      cursor: pointer;
    }
  </style>
</head>
<body>
<div>
  <canvas id="gameCanvas"></canvas>
  <p id="score">分数: 0</p>
  <div>
    <label>速度：</label>
    <select id="speedSelect" style="width:108px;height: 48px;font-size: 16px">
      <option value="100">普通</option>
      <option value="50">快速</option>
      <option value="200">慢速</option>
    </select>
  </div>
  <div class="controls">
    <button id="startButton">开始游戏</button>
    <button id="pauseContinueButton">暂停游戏</button>

  </div>
</div>
<script src="snake.js"></script>
</body>
</html>

